<template>
  <div style="font-size: 0.35rem">
    <p style="text-align: center; margin-top: 0.5rem">
      <span @click="out" style="float: left; margin-left: 0.2rem"><</span
      >系统设置
    </p>
    <div>
      <div
        style="
          height: 1.7rem;
          line-height: 1.5rem;
          border-bottom: 0.2rem solid #f5f4f4;
        "
      >
        <div style="padding-left: 0.3rem; padding-right: 0.3rem">
          <p style="float: left">头像</p>
          <p style="float: right">
            <van-uploader v-model="fileList" reupload max-count="1" />
            <span
              style="
                color: #ccc;
                margin-left: 0.1rem;
                float: right;
                font-size: 0.4rem;
              "
              >></span
            >
          </p>
        </div>
      </div>
      <div
        style="
          clear: both;
          padding-left: 0.3rem;
          padding-right: 0.3rem;
          border-bottom: 0.2rem solid #f5f4f4;
        "
      >
        <p style="width: 100%; height: 1rem; line-height: 1rem" @click="xiu">
          <span style="display: inline-block; float: left">昵称</span>
          <span style="display: inline-block; float: right"
            ><input
              type="text"
              v-model="nn"
              style="width: 3rem; border: none"
            />
            <span style="color: #ccc">></span></span
          >
        </p>
        <p style="width: 100%; height: 1rem; line-height: 1rem" @click="she">
          <span>账号设置</span>
          <span style="color: #ccc; display: inline-block; float: right"
            >></span
          >
        </p>
        <p style="width: 100%; height: 1rem; line-height: 1rem" @click="yin">
          <span>隐私</span>
          <span style="color: #ccc; display: inline-block; float: right"
            >></span
          >
        </p>
        <p style="width: 100%; height: 1rem; line-height: 1rem" @click="yin">
          <span>当前版本</span>
          <span style="display: inline-block; float: right">4.0.0</span>
        </p>
      </div>
      <p
        style="width: 100%; height: 1rem; line-height: 1rem; text-align: center"
      >
        <button
          style="
            width: 100%;
            height: 1rem;
            line-height: 1.4rem;
            text-align: center;
            background: #fff;
            border: none;
            color: red;
          "
          @click="outdl"
        >
          退出登录
        </button>
      </p>
      <div style="background: #f5f4f4; height: 3.5rem"></div>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import { useRouter } from 'vue-router'



const fileList = ref([])
console.log(fileList.value)
const img = localStorage.setItem('img', fileList.value[0])

const router = useRouter()
const she = () => {
  router.push('/ding/she')
}
const out = () => {
  router.push('/ding/dingd')
}
const yin = () => {
  router.push('/ding/yin')
}

const outdl = () => {
  localStorage.removeItem('username')
  router.push('/ding/dingd')
}

let nn = ref('shjakdgashj')
const xiu = () => {
  router.push('/ding/xiu')
}

const ncnn = localStorage.getItem('nc')
nn.value = ncnn
</script>

<style>
.box {
  background: #f5f4f4;
}
</style>
